<?php
$this->breadcrumbs=array(
	'User',
);?>
<style type="text/css">
  #sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 60%;
  }
  #sortable li {
    margin: 0 3px 3px 3px;
    padding: 0.4em;
    padding-left: 1.5em;
    font-size: 1.4em;
    height: 18px;
  }
  #sortable li span {
    position: absolute;
    margin-left: -1.3em;
  }
</style>
	

<script>
  $(document).ready( function() {
	 
    $( function() {
      $("#contentLeft ul").sortable({ opacity: 0.6, cursor: 'move', update: function() {
          var order = $(this).sortable("serialize") + '&action=updateRecordsListings';
          $.post("/User/SortAndSave", order, function(response) {
            $("#sortabl").html(response);
          });

        }

      });
    });

  });

  function del(ida){
	         $.post("/User/Del",{ id: ida } , function(response) {
	            $("#sortabl").html(response);
	          });
	  };
  
  
  </script>


<?php
     $cs=Yii::app()->clientScript;
   	 $cs->registerCSSFile(Yii::app()->request->baseUrl.'/js/dialog/css/ui-lightness/jquery-ui-1.8.4.custom.css');
     $cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/dialog/js/jquery-1.4.2.min.js', CClientScript::POS_HEAD);
     $cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/dialog/js/jquery-ui-1.8.5.custom.min.js', CClientScript::POS_HEAD);
?>
    
    
<h1><?php echo $this->id . '/' . $this->action->id; ?></h1>
<h1>User name - <?php echo $user->username ?></h1>
<div id="contentLeft">
	<ul class="todoList" id="sortabl" ><!-- ToDo List begin -->	
	
	<?php
	//print_r($projects); 
	    $i=1;
		foreach ($projects as $key) 
		{
			
			
			echo "<li class='todo' id='recArray_".$i."'>
			<div class='text'>".$key->project_name.'</div>
			<div class="action">
				<a class="open" href=/main/'.$key->project_id.'>open</a>
				<a class="delete" href="#" onClick="del('.$key->project_id.')">Delete</a>
			</div>
			</li>';
		$i++;
		}
		//echo CHtml::ajax("Update data");
	?>
	</ul>
	
	</div>
 <div id="contentRight">
      
 </div>

<script type="text/javascript">
  $( function() {
    $("#dialogTest").dialog({
      autoOpen: false
    });
    $("#openD").click( function() {
      $("#dialogTest").dialog("open");
    });

  });
	</script>
		<a id="openD" href="#">Добавить проэкт</a>
	<div id="dialogTest" title="Новый проэкт">
	 <div class="form">
    
	<?php echo CHtml::form(); ?>
    <div class="row">
        <?php
            echo CHtml::label('Название проэкта', 'input_name');
            echo CHtml::textField('input_name'); 
        ?>
    </div>
    
      <div class="row">
        <?php
            echo CHtml::label('Описание', 'input_about');
            echo CHtml::textArea('input_about'); 
        ?>
    </div>
    
    <div class="row">
        <?php 
          //  echo CHtml::label('Результат', 'output');
            // name и id для textarea автоматически заданы как 'output'.
         //   echo '<h1 id=output>'.$output.'</h1>';
        ?>
    </div>
    
    <?php 
    // Второй параметр пуст, значит отсылаем данные на тот же URL. Третий параметр задаёт опции запроса. Подробнее с ними можно ознакомиться в документации jQuery.
    echo CHtml::ajaxLink('Добавит проэкт', '/User/add', array(
        'type' => 'POST',
        // Результат запроса записываем в элемент, найденный по CSS-селектору #output.
        'update' => '#sortabl',
    ),
    array(
        // Меняем тип элемента на submit, чтобы у пользователей с отключенным JavaScript всё было хорошо.
        'type' => 'submit',
        'update'=>'#output'
    )); 

    echo CHtml::endForm();
    ?>
    
    
</div>
</div>


